button{
    color: red;
}
.box{
    width: 100vw;
    height: 100vw;
    .user{
        width:100vw;
        height: 100rpx;
        background-color: rgb(233, 233, 233);
        display: flex;
        align-items: center;
        padding: 10rpx;
        box-shadow: 0 0 5rpx gray;
        image{
            width: 80rpx;
            height: 80rpx;
            border-radius: 40rpx;
        }
        text{
            padding: 0px 10px;
            color: rgb(0, 0, 0);
        }
    }      
    .record{
        width: 100vw;
        .record_li_head{
            display: flex;
            background-color: rgb(196, 196, 196);
            color: white;
            view{
                width: 20%;
                text-align: left;
                padding:0 10rpx;
            }
            view:nth-child(2){
                width: 60%;
            }
        }
        .record_box{
            width: 100vw;
            height: 800rpx;
            overflow: scroll;
            overflow-x: hidden;
            .record_li{
                width: 100vw;
                height: 80rpx;
                border-bottom: 2rpx dashed gray;
                display: flex;
                align-items: center;
                // justify-content: space-around;
                padding: 0 10rpx;
                view{
                    width: 20%;
                    text-align: left;
                    padding:0 10rpx;
                }
                view:nth-child(2){
                    width: 60%;
                }
            }
        }
        .record_li:hover{
            background-color: gray;
            color: white;
        }
    } 
}